package com.example.app.pages.main.home.addNew.addRecord.MyModalBottomSheetRelationPicker

import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.AddCircle
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.SheetState
import androidx.compose.material3.SheetValue
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalConfiguration
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp
import com.example.app.cls.MyState
import com.example.app.components.MyBottomAppBar.MyBottomAppBar
import com.example.app.components.MyButton.MyTextButton
import com.example.app.components.MyButton.MyTextIconButton
import com.example.app.components.MyDialog.MyfullScreenDialog
import com.example.app.components.MyDialog.MyfullScreenDialogState
import com.example.app.components.MyIcon.MyDownIcon
import com.example.app.components.MyModalBottomSheet.MyModalBottomSheetCustomTopBarAndBottomBar
import com.example.app.components.MyText.MyText
import com.example.app.data.bean.routeAddAccount.AccountRelationPeople
import com.example.app.pages.main.home.addNew.addRecord.IncomeAccountRelationPeopleList
import com.example.app.pages.main.home.me.viewModel.AddNewViewModel
import com.example.app.viewmodel.MainViewModel
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.asStateFlow
import kotlinx.coroutines.flow.update

class MyModalBottomSheetRelationPickerState : MyState() {
    //当前选中的关系
    var _selected = MutableStateFlow<AccountRelationPeople?>(null)
    var selected = _selected.asStateFlow()
    fun flowUpdate_selected(value: AccountRelationPeople?) {
        _selected.update {
            value
        }
    }
}

var myModalBottomSheetRelationPicker_fullScreenDialogState = MyfullScreenDialogState()
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyModalBottomSheetRelationPicker(

    onConfirm: () -> Unit,

) {
    var scope = rememberCoroutineScope()
    var visible = myModalBottomSheetRelationPickerState.visible.collectAsState()
    //这个是bottomSheet的state
    var sheetState = SheetState(
        initialValue = SheetValue.Hidden,
        density = LocalDensity.current,
        skipPartiallyExpanded = true //这个初始化是为了，一打开就是全部高度，不用再滑到顶部，限制滑动到顶部
    )
    var windowHeight = with(LocalDensity.current) {
        LocalConfiguration.current.screenHeightDp
    }


    MyfullScreenDialog(myfullScreenDialogState = myModalBottomSheetRelationPicker_fullScreenDialogState)

    if (visible.value) {
        MyModalBottomSheetCustomTopBarAndBottomBar(
            sheetState = sheetState,
            onDismissRequest = {
                onConfirm()
                myModalBottomSheetRelationPickerState.flowUpdate_visible(false)
            },
            content = {
                Box(
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(windowHeight.dp * .5f)
                ) {
                    IncomeAccountRelationPeopleList()
                }
            },
            topBarTitle = {
                MyText(text = "选择")
            },
            topBarActions = {
            },
            topNavigationIcon = {
                MyDownIcon(modifier = Modifier.clickable {
                    myModalBottomSheetRelationPickerState.flowUpdate_visible(false)
                })
            },
            bottomAppBarContent = {
                MyBottomAppBar(
                    containerColor = MaterialTheme.colorScheme.surface,
                    actions = {
                        Row(
                            horizontalArrangement = Arrangement.SpaceBetween,
                            modifier = Modifier.fillMaxWidth()
                        ) {
                            MyTextIconButton(
                                text = "新增",
                                imageVector = Icons.Filled.AddCircle,
                                onClick = {
                                    myModalBottomSheetRelationPicker_fullScreenDialogState.flowUpdate_visible(true)
                                    myModalBottomSheetRelationPicker_fullScreenDialogState.flowUpdate_cotnent { animateOffsetX, windowWidth ->
                                        //新增关系
                                        AddRelation(
                                            animateOffsetX = animateOffsetX.value,
                                            fullScreenDialogState = myModalBottomSheetRelationPicker_fullScreenDialogState,

                                            dismiss = {
                                                myModalBottomSheetRelationPicker_fullScreenDialogState.flowUpdate_visible(false)
                                            }
                                        )
                                    }
                                }
                            )

                            MyTextButton(onClick = {
                                myModalBottomSheetRelationPicker_fullScreenDialogState.flowUpdate_visible(true)
                                myModalBottomSheetRelationPicker_fullScreenDialogState.flowUpdate_cotnent { animateOffsetX, windowWidth ->
                                    //管理关系
                                    ManageRelation(
                                        animateOffsetX = animateOffsetX.value,
                                        fullScreenDialogState = myModalBottomSheetRelationPicker_fullScreenDialogState,

                                    )
                                }
                            }) {
                                MyText(text = "管理")
                            }
                        }
                    },
                )
            }
        )
    }
}